<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>


    <link rel="stylesheet" href="./index.css">
</head>

<body>


    <div id="navbar">
        <div class="logo">
            <img src="./image/navlogo.png" alt="">


        </div>
        <!--导航-->
        <div class="nav">
            <ul class=" top">
                <li><span>首页</span></li>
                <li>探索</li>
                <li>标签</li>
                <li>摄影师</li>
                <li>签约摄影师招募</li>
                <li>天空之城短视频</li>
            </ul>


        </div>

        <!--登录-->
        <div class="denglu">
            <div class="input">
                <input type="text">
                <span>
                    搜索
                </span>
            </div>


            <div class="show">
                <span>登录</span>
                <span>注册</span>
            </div>
        </div>


    </div>


    <!--轮番图-->
    <div id="content">

        <div class="slide-box">

            <div class="slide-content">
                <ul class="listbox">

                    <li class="active"><img src="./image/1698745544.jpg" alt=""></li>
                    <li><img src="./image/1698745545.jpg" alt=""></li>
                    <li><img src="./image/1698745546.jpg" alt=""></li>
                    <li><img src="./image/1698745547.jpg" alt=""></li>
                    <li><img src="./image/1698745548.jpg" alt=""></li>
                    <li><img src="./image/1698745549.jpg" alt=""></li>
                    <li><img src="./image/1698745550.jpg" alt=""></li>

                </ul>




            </div>



            <div class="dot-box">
                <span class="dot-active"></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>

            </div>



        </div>


    </div>



    <!--热门-->

    <div class="hot">

        <div class="hot1">
            <h1>热门航拍点</h1>
            <a href=""> <span>热门航拍点集锦</span></a>
        </div>



        <div class="hotcontent">
            <div class="city">
                <div class="list">
                    <img src="./image/ @2x.png" alt="">
                </div>

                <span>澳大利亚</span>




            </div>

            <div class="city">

                <div class="list">
                    <img src="./image/div(1).png" alt="">
                </div>
                <span>美国</span>



            </div>

            <div class="city">
                <div class="list">
                    <img src="./image/div(2).png" alt="">
                </div>
                <span>冰岛</span>



            </div>
            <div class="city">
                <div class="list">
                    <img src="./image/div(3).png" alt="">
                </div>
                <span>西藏</span>


            </div>
            <div class="city">
                <div class="list">
                    <img src="./image/div(4).png" alt="">
                </div>
                <span>上海</span>


            </div>
            <div class="city">
                <div class="list">
                    <img src="./image/div(5).png" alt="">
                </div>
                <span>新疆</span>


            </div>





        </div>



    </div>


    <!--精选-->

    <div class="fliter-con">
        <div class="fliter">

            <span>精选</span>
        </div>


        <div class="fliterContent">
            <!--内容-->

            <div class="nature">
                <div class="nt">
                    <div>自然</div>


                    <div>
                        <a href=""> 更多</a>
                    </div>

                </div>
                <div class="fenji">
                    <div class="heizi"><a class="tupan" href=""><img src="./image/div(19).png"></img>
                            <div class="yadan">
                                <p><b>雅丹群</b></p>
                                <p class="shebei">设备:<a>Djl Air 25</a></p>
                                <p class="shisan"> 720 &emsp;&emsp;&emsp; 24</p>
                                <hr class="sux">
                                <p class="lixu"><img src="./img/045.jpg"> 李旭 <a>2023年2月11日</a></p>
                            </div>
                    </div>
                    <div class="heizi"><a class="tupan" href=""><img src="./img/031.jpg"></a>
                        <div class="yadan">
                            <p><b>雅丹群貌群</b></p>
                            <p class="shebei">设备:<a>Djl Air 25</a></p>
                            <p class="shisan"> 330 &emsp;&emsp;&emsp; 18</p>
                            <hr class="sux">
                            <p class="lixu"><img src="./img/045.jpg"> 李旭 <a>2023年2月12日</a></p>
                        </div>
                    </div>
                    <div class="heizi"><a class="tupan" href=""><img src="./img/032.jpg"></img>
                            <div class="yadan">
                                <p><b>The Faroe lalands Mavic Pro 2</b></p>
                                <p class="shebei">设备:<a>Mavic 2 Pro</a></p>
                                <p class="shisan"> 280 &emsp;&emsp;&emsp; 22</p>
                                <hr class="sux">
                                <p class="lixu"><img src="./img/045.jpg"> 李旭 <a>2023年2月11日</a></p>
                            </div>
                    </div>
                    <div class="heizi"><a class="tupan" href=""><img src="./img/033.jpg"></a>
                        <div class="yadan">
                            <p><b>新疆的冬天有多美-禾木雪季</b></p>
                            <p class="shebei">设备:<a>Mavic 2 Pro</a></p>
                            <p class="shisan"> 176 &emsp;&emsp;&emsp; 10</p>
                            <hr class="sux">
                            <p class="lixu"><img src="./img/045.jpg"> 李旭 <a>2023年2月11日</a></p>
                        </div>
                    </div>
                </div>





            </div>


            <div class="nature">
                <div class=nt>
                    <div>城市</div>
                    <div>
                        <a href="./html/city.html">更多></a>
                    </div>
                </div>
                <!-- swiper 渲染数据 -->
                <div class="swiper-container" id="ZR">
                    <div class="swiper-wrapper cs">

                    </div>

                    <!-- 分页器 -->
                    <div class="swiper-pagination"></div>
                </div>
            </div>

            <div class="nature">
                <div class=nt>
                    <div>运动</div>
                    <div>
                        <a href="./html/motion.html">更多></a>
                    </div>
                </div>
                <!-- swiper 渲染数据 -->
                <div class="swiper-container" id="ZR">
                    <div class="swiper-wrapper yd">

                    </div>

                    <!-- 分页器 -->
                    <div class="swiper-pagination"></div>
                </div>
            </div>


            <div class="nature">
                <div class=nt>
                    <div>人物</div>
                    <div>
                        <a href="./html/character.html">更多></a>
                    </div>
                </div>
                <!-- swiper 渲染数据 -->
                <div class="swiper-container" id="ZR">
                    <div class="swiper-wrapper rw">

                    </div>

                    <!-- 分页器 -->
                    <div class="swiper-pagination"></div>
                </div>
            </div>

            <div class="nature">
                <div class=nt>
                    <div>签约摄影师</div>
                    <div>
                        <a href="./html/Photographer.html">更多></a>
                    </div>
                </div>
                <!-- swiper 渲染数据 -->
                <div class="swiper-container" id="ZR">
                    <div class="swiper-wrapper qy">

                    </div>

                    <!-- 分页器 -->
                    <div class="swiper-pagination"></div>
                </div>
            </div>


            <div class="nature Hot_labels">
                <div class=nt>
                    <div>热门标签</div>
                    <div>
                        <a href="">更多></a>
                    </div>
                </div>
                <!-- swiper 渲染数据 -->
                <div class="hotdata">
                    <div class="name">
                        <div class="list">
                            <img src="./image/div(26).png" alt="">
                        </div>

                        <span>澳大利亚</span>




                    </div>

                    <div class="name">

                        <div class="list">
                            <img src="./image/div(27).png" alt="">
                        </div>
                        <span>美国</span>



                    </div>

                    <div class="name">
                        <div class="list">
                            <img src="./image/div(28).png" alt="">
                        </div>
                        <span>冰岛</span>



                    </div>
                    <div class="name">
                        <div class="list">
                            <img src="./image/div(29).png" alt="">
                        </div>
                        <span>西藏</span>


                    </div>

                    <div class="name">
                        <div class="list">
                            <img src="./image/div@2x(30).png" alt="">
                        </div>
                        <span>新疆</span>


                    </div>
                    <div class="name">
                        <div class="list">
                            <img src="./image/div@2x(31).png" alt="">
                        </div>
                        <span>上海</span>


                    </div>


                </div>






            </div>








        </div>

    </div>


    <div class="box5">
        <div class="box5-1">
            <div>Copyright 2022 Skypixel.com 天空之城 版权所有</div>
            <div>
                <p>使用条款</p>
                <p>隐私政策</p>
                <p>内容指引</p>
                <p>网站反馈</p>
                <p>常见问题</p>
            </div>
            <div>
                <p>中文</p>
                <p>|</p>
                <p>English</p>
            </div>
        </div>
        <div>
            <p>粤ICP备2022092332号</p>
        </div>
    </div>








    <script src="./index.js"></script>




</body>

</html>